<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<style>
			*{
				margin: 0;
				padding: 0;
			}
			.box{
				background-color: aqua;
				width: 100px;
				height: 100px;
				display: none;
				position: absolute;
				top: 0;
				left: 0;
			}
			a{
				display: block;
			}
		</style>
	</body>
	
	<div class="box">
		<!-- <a href="">111</a>
		<a href="">111</a>
		<a href="">111</a> -->
	</div>
	
	
	<script>
		var box=document.querySelector('.box')
		// console.log(box)
		document.addEventListener('contextmenu',function(e){
			e.preventDefault()
			box.style.left=e.offsetX +'px'
			box.style.top=e.offsetY +'px'
			// console.log('111')
			box.style.display='block'
		});
		document.addEventListener('click',function(){
			box.style.display='none'
		})
		
	</script>
</html>